// == 值比较  === 类型比较 $(id) ---->  document.getElementById(id)
function $(id) {
    return typeof id === 'string' ? document.getElementById(id) : id;
}

// 当页面加载完毕
window.onload = function () {
    // 拿到所有的标题(li标签) 和 标题对应的内容(div)
    let tab_header=document.getElementById("tab-header");
    let uls = tab_header.getElementsByTagName('ul');
    let lis = uls[0].getElementsByTagName('li');

    let tab_content = document.getElementById('tab-content');
    let divs = tab_content.getElementsByClassName('dom');

    // 判断
    if (lis.length != divs.length) return;
    // 遍历
    for (let i = 0; i < lis.length; i++) {
        // 取出li标签
        let li = lis[i];
        li.id = i;
//        console.log(li);
        // 监听鼠标的移动
        li.onclick = function () {
            for (let j = 0; j < lis.length; j++) {
                lis[j].className = '';
                divs[j].style.display = 'none';
            }
            this.className = 'selected';
            divs[this.id].style.display = 'block';
        }
    }

}